/*
* @Author: chenqian
* @Date:   2017-11-30 16:30:03
* @Last Modified by:   Leo
* @Last Modified time: 2017-12-04 09:12:49
*/
html,body,div,a,span,h1,h2,h3,h4,h5,h6,img,i,input,button
,form,textarea,p,textarea,video{margin: 0;padding: 0;outline: 0;box-sizing: border-box;}

body,html{
	width: 100%;
	height: 100%;
}
.content{
	height: 100%;
	display: flex;
	flex-direction:column;
}
/*头部*/
.content .header{
	flex-flow:0;
	flex-shkrin:0;
	flex-basis: 50px;
	background-color: #fff;
}
.header p{
	display: inline-block;
	line-height: 50px;
	text-align: center;
	font-size: 18px;
	padding-right: 88px;
	padding-left: 15px;
}
.header i{
	float: right;
	line-height: 50px;
	padding-right: 20px;
	font-size: 20px;
}
.header{
	content: "";
	overflow: hidden;
	clear: both;
}
/*中部*/
.content .bodyer{
	flex-flow:1;
	flex-shkrin:1;
	flex-basis:100%;
	overflow: auto;
}
.bodyer::-webkit-scrollbar {
	width: 3px;
	background-color: transparent;
}
.bodyer::-webkit-scrollbar-thumb {
	width: 3px;
	background-color: #eee;
}
.bodyer .search{
	width: 100%;
	height: 40px;
	background-color: #eee;
	text-align: center;
}
.bodyer .search {
	position: relative;
	color: #eee;
}
.bodyer .search input{
	width: 95%;
	height: 28px;
	border-radius: 5px;
	line-height: 28px;
	margin-top:6px;
	border:0;
	padding-left:25px;
}
.bodyer .search i{
	position: absolute;
	left: 15px;
	top: 12px;
}
.bodyer .my{
	width: 100%;
	height: 60px;
}
.bodyer .my .left{
	width: 19%;
	height: 60px;
	float: left;
	padding:6px 12px;
}
.bodyer .my .left .at_left,.comment_left,.up_left,.sub_left,.safe_left,.focus_left{
	width: 45px;
	height: 45px;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	font-size: 32px;
}
.bodyer .my .left .head_left img{
	width: 45px;
	height: 45px;
	border-radius: 50%;
}
/*圆圈背景颜色*/
.bodyer .my .left .at_left{
	background-color: #2eb7bd;
}
.bodyer .my .left .comment_left{
	background-color: #4caf50;
}
.bodyer .my .left .up_left{
	background-color: #FF9800;
}
.bodyer .my .left .sub_left{
	background-color: #2196f3;
}
.bodyer .my .left .safe_left
{
	background-color: #9e9e9e;
}
.bodyer .my .left .focus_left
{
	background-color:#cc708f;
}
.bodyer .my .left i{
	display: inline-block;
	line-height: 45px;
}
.bodyer .my .right{
	width: 81%;
	height: 60px;
	border-bottom:1px solid #e4e1e1;
	float: left;
	position: relative;
}
.bodyer .my .right .span_one{
	position: absolute;
	right: 10px;
	top: 18px;
	font-size: 14px;
	color: #999;
}
.bodyer .my .right .p{
	display: inline-block;
	line-height: 60px;
}
.bodyer .my .right .p_one,.p_two{
	line-height: 25px;
}
.bodyer .my .right .p_two{
	font-size: 14px;
	color: #999;
}
.bodyer .my .right time{
	position: absolute;
	right: 10px;
	top: 12px;
	font-size: 12px;
	color: #999;
}
.bodyer .my .right .time{
	position: absolute;
	display: inline-block;
	width: 10px;
	height: 10px;
	top: 35px;
	right: 10px;
	background-color: red;
	border-radius: 50%;
}
/*底部*/
/* .content .footer{
	flex-flow:0;
	flex-shkrin:0;
	flex-basis: 50px;
	background-color: #fff;
} */
.footer {
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: 50px;
	background-color: #fff;
} 
.footer a {
	text-decoration: none;
	display: block;
	float: left;
	width: 20%;
	height: 50px;
	text-align: center;
	padding: 10px 0;
}
.footer a p {
	font-size: 13px;
	color: #666;
}
.footer a img {
	width: 20px;
}
.footer a i{
	width: 23px;
	height: 23px;
	font-size: 20px;
}
.footer a:nth-of-type(3) {
	background-color: orangered;
	padding: 12px 0;
	margin: 5px 0;
	border-radius: 3px;
}
.footer a:nth-of-type(4) img {
	width: 19px;
	height: 19px;
}
